<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title th:text="${sectionName}"></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css"/>
    <!-- 引入fontawesome字体图标 -->
    <link rel="stylesheet" type="text/css" href="/fontawesome/css/all.css"/>
    <!-- 自定义样式 -->
    <link rel="stylesheet" type="text/css" href="/css/bbs.css"/>
    <script type="application/javascript" src="/js/jquery-3.4.1.min.js"></script>
    <script type="application/javascript" src="/js/bootstrap.bundle.min.js"/>
    <script type="application/javascript" src="/js/bootstrap.min.js"></script>
</head>
<body>
<!-- 引入顶部工具栏 -->
<div th:replace="/top::topBar"></div>
<div class="container main" style="background-color: white">
    <div class="row">
        <div class="col-lg-9 col-md-9 col-sm-9 col-xs-12">
            <h2><span th:text="${sectionName}"></span></h2>
            <hr>
            <div class="col-lg-9 col-md-9 col-sm-9 col-xs-12" th:if="${section}=='questions'">
                <div class="media" th:each="question : ${paginationDTO.list}">
                    <img th:src="${question.user.avatarUrl}" class="mr-3 rounded littleImg"
                         alt="...">
                    <div class="media-body">
                        <h5 class="mt-0"><a th:href="@{'/profile/questions/'+${question.id}}"
                                            th:text="${question.title}"></a></h5>
                        [[${question.description}]]<br>
                        <span class="questionDetail">
                        • <span th:text="${question.commentCount}"></span>个评论
                        • <span th:text="${question.viewCount}"></span>次浏览
                        • <span th:text="${#dates.format(question.gmtCreate,'yyyy-MM-dd HH:mm')}"></span>
                    </span>
                    </div>
                </div>
                <nav aria-label="Page navigation example" style="float: right">
                    <ul class="pagination">
                        <li class="page-item"
                            th:class="${paginationDTO.pageNum == 1 ? 'page-item disabled ':'page-item'}">
                            <a class="page-link" href="#" aria-label="Previous"
                               th:href="@{/(currentPage=${paginationDTO.pageNum - 1})}">
                                <span aria-hidden="true">&laquo;</span>
                            </a>
                        </li>
                        <li class="page-item" th:each="i: ${#numbers.sequence(1, paginationDTO.pages)}"
                            th:class="${i == paginationDTO.pageNum ? 'page-item active':'page-item'}">
                            <a class="page-link" th:text="${i}"
                               th:href="@{'/profile/'+${section}(currentPage=${i})}"></a>
                            <!--                        @{'/details/'+${user.login}(orderId=${o.id})}-->
                        </li>
                        <li class="page-item"
                            th:class="${paginationDTO.pageNum == paginationDTO.pages ? 'page-item disabled ':'page-item'}">
                            <a class="page-link" href="#" aria-label="Next"
                               th:href="@{/(currentPage=${paginationDTO.pageNum + 1})}">
                                <span aria-hidden="true">&raquo;</span>
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>
            <div class="col-lg-9 col-md-9 col-sm-9 col-xs-12" th:if="${section}=='replies'">
                <div th:each="notification : ${paginationDTO.list}">
                    <span th:text="${notification.notifierName}">1</span>
                    <span th:text="${notification.outerTitle}"></span>
                </div>
            </div>
        </div>
        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
            <div class="list-group">
                <a th:href="@{/profile/questions}"
                   th:class="${section == 'questions' ? 'list-group-item list-group-item-action active':'list-group-item list-group-item-action'}">
                    我的问题
                </a>
                <a th:href="@{/profile/replies}"
                   th:class="${section == 'replies' ? 'list-group-item list-group-item-action active':'list-group-item list-group-item-action'}">
                    最新回复&nbsp; <span class="badge badge-secondary" style="float: right">999</span>
                </a>
            </div>
        </div>
    </div>
</div>
</body>
</html>